<template>
  <div>
    <!-- 弹出层 -->
    <van-popup class="mask" v-model="show" position="bottom" :overlay="false">
      <div id="close">
        <div></div>
        <div @click="show=!show" :style="{color:'#CBC8D9',fontSize:'6vw'}">✖</div>
      </div>

      <div  @click="show=!show">
        <div class="pet_more_list_block_name">
          <div class="pet_more_list_block_name_title">阅读 Read</div>
          <a href="#/fresh" title="宠物新鲜事" class="pet_more_list_block_line">
            <i class="iconfont pet_nav_xinxianshi pet_more_list_block_line_ico"></i>
            <div class="pet_more_list_block_line_font">新鲜事</div>
          </a>
          <a href="#/knowledge" title="宠物涨知识" class="pet_more_list_block_line">
            <i class="iconfont pet_nav_zhangzhishi pet_more_list_block_line_ico"></i>
            <div class="pet_more_list_block_line_font">涨知识</div>
          </a>
          <a href="#/scrawl" title="宠物看涂鸦" class="pet_more_list_block_line">
            <i class="iconfont pet_nav_kantuya pet_more_list_block_line_ico"></i>
            <div class="pet_more_list_block_line_font">看涂鸦</div>
          </a>
          <a href="#/subject" title="宠物萌专题" class="pet_more_list_block_line">
            <i class="iconfont pet_nav_mengzhuanti pet_more_list_block_line_ico"></i>
            <div class="pet_more_list_block_line_font">萌专题</div>
          </a>
          <a href="#/cyclo" title="宠物百科" class="pet_more_list_block_line">
            <i class="iconfont pet_nav_bk pet_more_list_block_line_ico"></i>
            <div class="pet_more_list_block_line_font">百科</div>
          </a>
          <a href="#/ask" title="宠物问答" class="pet_more_list_block_line">
            <i class="iconfont pet_nav_wd pet_more_list_block_line_ico"></i>
            <div class="pet_more_list_block_line_font">问答</div>
          </a>
          <a href="#/topic" title="宠物话题" class="pet_more_list_block_line">
            <i class="iconfont pet_nav_wd pet_more_list_block_line_ico pet_list_huati_ico"></i>
            <div class="pet_more_list_block_line_font">话题</div>
          </a>
          <div class="pet_more_list_block_name_title pet_more_list_block_line_height">服务 Service</div>
          <a href="#/hairdressing" title="宠物美容" class="pet_more_list_block_line">
            <i class="iconfont pet_nav_xinxianshi pet_more_list_block_line_ico"></i>
            <div class="pet_more_list_block_line_font">美容</div>
          </a>
          <a href="#/hospital" title="宠物医院" class="pet_more_list_block_line">
            <i class="iconfont pet_nav_zhangzhishi pet_more_list_block_line_ico"></i>
            <div class="pet_more_list_block_line_font">医院</div>
          </a>
          <a href="#/store" title="宠物店铺" class="pet_more_list_block_line">
            <i class="iconfont pet_nav_kantuya pet_more_list_block_line_ico"></i>
            <div class="pet_more_list_block_line_font">店铺</div>
          </a>
          <a href="#/phot" title="宠物摄影" class="pet_more_list_block_line">
            <i class="iconfont pet_nav_sy pet_more_list_block_line_ico"></i>
            <div class="pet_more_list_block_line_font">摄影</div>
          </a>
          <!--  <a href="http://m.petshow.cc/s/学校"  class="pet_more_list_block_line">
                <i class="iconfont pet_nav_xx pet_more_list_block_line_ico">&#xe612;</i>
                <div class="pet_more_list_block_line_font">学校</div>
          </a>-->
          <a href="#/waper" title="宠物水族" class="pet_more_list_block_line">
            <i class="iconfont pet_nav_sz pet_more_list_block_line_ico"></i>
            <div class="pet_more_list_block_line_font">水族</div>
          </a>
          <a href="#/cattery" title="宠物猫舍" class="pet_more_list_block_line">
            <i class="iconfont pet_nav_ms pet_more_list_block_line_ico"></i>
            <div class="pet_more_list_block_line_font">猫舍</div>
          </a>
          <a href="#/kennel" title="宠物犬舍" class="pet_more_list_block_line">
            <i class="iconfont pet_nav_qs pet_more_list_block_line_ico"></i>
            <div class="pet_more_list_block_line_font">犬舍</div>
          </a>
          <a href="#/other" title="宠物其它" class="pet_more_list_block_line">
            <i class="iconfont pet_nav_qt pet_more_list_block_line_ico"></i>
            <div class="pet_more_list_block_line_font">其它</div>
          </a>
        </div>
      </div>
    </van-popup>
  </div>
</template>

<script>
import bus from '../../bus.js'
import { Popup } from "vant";
export default {
  data() {
    return {
      show:false
    };
  },
  components: {
    Popup
  },
  created(){
    // bus.$on("headershow",this.changeshow)
    bus.$on("isshow",this.changeshow)
  },
  methods:{
    changeshow(){
      this.show=!this.show;
    }
  }
};
</script>

<style scoped>
.mask {
  height: 145vw;
  background-color: rgba(48, 52, 53, 0.9);
  text-align: center;
}
.mask #close {
  display: flex;
  justify-content: space-between;
  padding: 2vw 4vw;
}
.title {
  color: #908e8f;
}
</style>